import { Descriptions, Drawer } from 'antd';
import React from 'react';

import { descriptionsList } from '../config';

interface IProps {
  DrawerId: any;
  DrawerVisible: boolean;
  onDraweClose: () => void;
}

const DescriptionsDrawer = (props: IProps) => {
  const { DrawerId, DrawerVisible, onDraweClose } = props;
  return (
    <Drawer
      title="详情"
      placement="right"
      onClose={onDraweClose}
      visible={DrawerVisible}
    >
      <Descriptions
        title={'订单编号：' + DrawerId.orderNumber}
        bordered
        style={{ width: '450px' }}
      >
        {descriptionsList.map((item) => (
          <Descriptions.Item label={item.label} key={item.key}>
            {DrawerId[item.key]}
          </Descriptions.Item>
        ))}
      </Descriptions>
    </Drawer>
  );
};

export default DescriptionsDrawer;
